/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
  CCell, Cell, IconCheckSquare, IconSquare, Table, TableBody, TableHead, TableRow, Text,
} from "customize-easy-ui-component";
import {DirectLink} from "../../routing/Link";
import {TailMenRowIspCheck} from "../contain/rarelyVary";
import {RepLink} from "../common/base";

/**分项列表 结论报告附页 ：顺序安排；
 * */
export const 分项表附页Vs = ({theme, orc, rep}: { theme: any, orc: any, rep: any }
) => {
  let projectseq=0;
  return <>
    <div css={{"@media print": {paddingBottom: '3.5rem', pageBreakInside: 'avoid'}} }>
      <Text id='ProjectsApx' variant="h2" css={{textAlign: 'center', marginTop: '1rem',
      }}>压力容器定期检验报告附页</Text>
      <div css={{display: 'flex', justifyContent: 'space-between'}}>
        <Text>单位内部编号：{orc.单位内部编号}</Text>
        <Text>报告编号：{rep.isp.no}</Text>
      </div>
    </div>
    <Table fixed={ ["4.2%","%","18%","37%"] } css={{borderCollapse: 'collapse', "@media print": {marginTop: '-3.5rem'}}} tight  miniw={800}>
      <TableHead>
        <TableRow>
          <CCell>序号</CCell>
          <CCell>检验项目</CCell>
          <CCell>检验结果</CCell>
          <CCell>说明</CCell>
        </TableRow>
      </TableHead>
      <TableBody>
        {orc?.Projects?.length > 0 ?
              <>{orc.Projects.map((prj: any, i: number) => {
                if(prj?.na) return null;
                projectseq++;
                return (
                    <DirectLink key={i} href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProjectList?from=${i}#ProjectList`}>
                      <TableRow>
                        <CCell component="th" scope="row">{projectseq}</CCell>
                        <Cell>
                          <div css={{display: 'flex', alignItems: 'center'}}>
                            {prj?.do ? <IconCheckSquare size='sm'/> :
                                <IconSquare size='sm'/>}&nbsp;{prj?.name}
                          </div>
                        </Cell>
                        <CCell>{prj?.res??'／'}</CCell>
                        <CCell>{prj?.memo}</CCell>
                      </TableRow>
                    </DirectLink>
                );
              })
              }
              </>
              :
              <TableRow><CCell colSpan={5}><Text variant="h2" >烦请首先初始化项目表！</Text></CCell></TableRow>
        }
        <RepLink rep={rep} tag={'ProjectListGen'}>
          <TableRow>
            <Cell colSpan={4}><div css={{minHeight: '2rem',whiteSpace:'pre-wrap'
            }}>备注：<br/>
              {orc.项页备注??'／'}</div></Cell>
          </TableRow>
        </RepLink>
      </TableBody>
    </Table>
    <TailMenRowIspCheck orc={orc} rep={rep} cap={'检测'} href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProjectList#ProjectList`}>
    </TailMenRowIspCheck>
  </>;
};
